<template>
  <div class="emr-content-module module-chiefComplaint">
    <div class="h3" style="line-height: 2" id="chiefComplaintReview">主诉</div>
    <div class="content-wrapper" :class="{ locked: d.disabled }">
      <span class="inline-block">
        <el-checkbox-group v-model="d.chiefComplaint.attr1">
          <el-checkbox
            size="medium"
            label="反复"
            :disabled="d.disabled"
          ></el-checkbox>
          <el-checkbox
            size="medium"
            label="鼻塞"
            :disabled="d.disabled"
          ></el-checkbox>
          <el-checkbox
            size="medium"
            label="清水样涕"
            :disabled="d.disabled"
          ></el-checkbox>
          <el-checkbox
            size="medium"
            label="打喷嚏"
            :disabled="d.disabled"
          ></el-checkbox>
          <el-checkbox
            size="medium"
            label="鼻痒"
            :disabled="d.disabled"
          ></el-checkbox>
        </el-checkbox-group>
      </span>
      <el-select
        clearable
        size="medium"
        v-model="d.chiefComplaint.attr2"
        :disabled="d.disabled"
        style="width: 4rem"
      >
        <el-option
          v-for="(item, idx) in YEARS"
          :value="item"
          :disabled="d.disabled"
          :key="'module-chiefComplaint_YEARS_KEY_' + idx"
        >
          {{ item }}
        </el-option>
      </el-select>
      <span>年</span>
      <el-select
        clearable
        size="medium"
        v-model="d.chiefComplaint.attr3"
        :disabled="d.disabled"
        placeholder=""
        style="width: 4rem"
      >
        <el-option
          v-for="(item, idx) in MONTHS"
          :value="item"
          :key="'module-chiefComplaint_MONTHS_KEY_' + idx"
        >
          {{ item }}
        </el-option>
      </el-select>
      <span>月</span>
      <el-select
        clearable
        size="medium"
        v-model="d.chiefComplaint.attr4"
        :disabled="d.disabled"
        placeholder=""
        style="width: 4rem"
      >
        <el-option
          v-for="(item, idx) in DAYS"
          :value="item"
          :key="'module-chiefComplaint_DAYS_KEY_' + idx"
        >
          {{ item }}
        </el-option>
      </el-select>
      <span>天(</span>
      <el-checkbox
        size="medium"
        :disabled="d.disabled"
        v-model="d.chiefComplaint.attr5"
      >
        每天症状持续或累计约1小时以上
      </el-checkbox>
      <span>)</span>
      <el-input
        size="medium"
        type="textarea"
        :disabled="d.disabled"
        placeholder="补充内容,限制100个字符以内 "
        :maxlength="100"
        :autosize="{ minRows: 1, maxRows: 4 }"
        v-model="d.chiefComplaint.attr6"
        style="margin-top: 0.5rem"
      ></el-input>
    </div>
  </div>
</template>
<script>
  import { reactive, inject } from 'vue'
  export default {
    setup() {
      // attr1 = []
      const initForm = function () {
        return {
          attr1: [],
          attr2: null,
          attr3: null,
          attr4: null,
          attr5: null,
          attr6: null,
        }
      }
      const d = reactive({ chiefComplaint: initForm(), disabled: false })
      const YEARS = inject('YEARS')
      const MONTHS = inject('MONTHS')
      const DAYS = inject('DAYS')

      const getData = function () {
        return d.chiefComplaint
      }
      return {
        d,
        YEARS,
        MONTHS,
        DAYS,
        getData,
      }
    },
  }
</script>
<style lang="scss" scoped>
  @import '@/styles/emr.scss';
</style>
